<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Poll Monster</title>
<script
	src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"
	type="text/javascript"></script>
<script
	src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/jquery-ui.min.js"
	type="text/javascript"></script>
<link
	href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/themes/ui-lightness/jquery-ui.css"
	type="text/css" rel="stylesheet"></link>
<style>
* {
	background: none repeat scroll 0 0 transparent;
	font-size: 100%;
	font-weight: normal;
	margin: 0;
	padding: 0;
	border: 0 none;
	outline: 0 none;
}

body {
	background-color: #f0f0f0;
	font: 62.5% Verdana, Arial, sans-serif !important;
	margin: 5px;
}

label,input {
/*	display: block;*/
}

input.text {
	padding: .4em;
}

fieldset {
	margin-top: 25px;
}

#content div {
	overflow: auto;
	padding: 5px;
}

#consoleOutput {
	font-family: Lucida Console, Monospace;
}
</style>
<script type="text/javascript">
	var PoMo = {
		url : null,
		connected : false,
		windowResize : function() {
			$('#content').height($(window).height() - 16);
			$('#content > div').height($('#content').innerHeight() - $('#content > ul').outerHeight() - 14);
		},
		call : function(request, success, error) {
			var timer = setTimeout(function() {
				if (error) {
					error('Error', 'Timeout', null);
				} else if (success) {
					success(null, 'Timeout', null);
				}
				error = null;
				success = null;
			}, 10000);
			PoMo.console('> '+request.method+' [ ]');
			$.ajax({
				url : PoMo.url,
				data : request,
				dataType : 'jsonp',
				timeout : 10000,
				success : function(data, textStatus, XHR) {
					PoMo.console('< ok');
					clearTimeout(timer);
					if (success) {
						success(data, textStatus, XHR);
					}
				},
				error : function(XHR, textStatus, errorThrown) {
					PoMo.console('! error');
					clearTimeout(timer);
					if (error) {
						error((errorThrown ? errorThrown : 'Error'),
								textStatus, XHR);
					} else if (success) {
						success(null, 'Timeout', XHR);
					}
				}
			});
		},
		connect : function(url) {
			PoMo.url = url;
			PoMo.connected = false;
			PoMo.call({
				method : 'ping'
			}, function(d) {
				PoMo.connected = true;
			}, function(t, e) {
			});
		},
		console : function(text) {
			$('#consoleOutput').append(text+'<br/>');
		}
	};
	$(document).ready(function() {
		$('#content').tabs();
		$('#dashboardButtonConnect').button().click(function(){
			PoMo.connect($('#dashboardInputUrl').val());
		});
		$(window).resize(PoMo.windowResize);
		PoMo.windowResize();
	});
</script>
</head>
<body>
<!-- 
<div id="dialogUrl" title="Management Console">
	<p class="validateTips">Enter the URL for a Poll Monster JSON-P service.</p>
	<form>
	<fieldset>
		<label for="inputUrl">URL</label>
		<input type="text" name="inputUrl" id="inputUrl" class="text ui-widget-content ui-corner-all" />
	</fieldset>
	</form>
</div>
-->
<div id="content">
	<ul>
		<li><a href="#dashboard">Dashboard</a></li>
		<li><a href="#console">Console</a></li>
		<li><a href="#processes">Processes</a></li>
		<li><a href="#orders">Orders</a></li>
	</ul>
	<div id="dashboard">
		Poll Monster JSON-P URL: <input id="dashboardInputUrl" name="dashboardInputUrl" type="text" class="text ui-widget-content" size="30"/> <button id="dashboardButtonConnect">Connect</button>
	</div>
	<div id="console">
		<div id="consoleOutput">
		</div>
	</div>
	<div id="processes">
		<div id="processList">
		</div>
	</div>
	<div id="orders">
		<div id="orderList">
		</div>
	</div>
</div>
</body>
</html>